<div ng-controller="scope">

<!-- contain BEGIN -->
    <div class="right-product right-full">
        <div class="center-back right-back">
            <div class="container-fluid">
                <div class="info-center">
                    <div class="page-header">
                        <div class="pull-left">
                            <h4>资源范围列表</h4>
                        </div>
                    </div>

                    <div class="search-box row">
                        <div class="col-md-1">
                            <button type="button" class="btn btn-default" ng-click="newlyAdded($event)" data-toggle="modal" data-target="#newlyAdded">
                                <span class="glyphicon glyphicon-plus"></span> 新增
                            </button>
                        </div>
                    </div>

                    <div class="clearfix"></div>

                    <div class="table-margin">
                        <table class="table table-bordered table-header">
                            <thead>
                                <tr>
                                    <td class="w10 text-center">资源服务编码</td>
                                    <td class="w10 text-center">资源服务名称</td>
                                    <td class="w10 text-center">资源服务URL</td>
                                    <td class="w10 text-center">资源类型</td>
                                    <td class="w10 text-center">描述</td>
                                    <td class="w10 text-center">操作</td>
                                </tr>
                            </thead>
                            <tbody>
                                <tr ng-repeat="val in tabVal">
                                    <td class="text-center">{{ val.code }}</td>
                                    <td class="text-center">{{ val.scopeName }}</td>
                                    <td class="text-center">{{ val.scopeUri }}</td>
                                    <td class="text-center">{{ val.scopeType }}</td>
                                    <td class="text-center">{{ val.description }}</td>
                                    
                                    
                                    <td class="text-center icon-td">
                                        <i class="icon-details" ng-click="details($event, $index)" data-toggle="modal" data-target="#details"></i>
                                        <i class="icon-edit"    ng-click="edit($event, $index)"    data-toggle="modal" data-target="#edit"></i>
                                        <i class="icon-delete"  ng-click="delete($event, $index)"  data-toggle="modal" data-target="#delete"></i>
                                    </td>
                                </tr>
                            </tbody>
                            <tfoot>
                                <tr>
                                    <td colspan="6">
                                        <div class="pull-right">
                                            <nav>
                                                <tm-pagination conf="paginationConf"></tm-pagination>
                                            </nav>
                                        </div>
                                    </td>
                                </tr>
                            </tfoot>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
<!-- contain END -->

<!-- 新增 BEGIN -->
    <div class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" id="newlyAdded">
        <div class="modal-dialog " role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                    <h4 class="modal-title" id="myModalLabel">新增资源范围</h4>
                </div>
                <div class="modal-body">
                    <form name="scopesAdd_form" novalidate>
                        <div class="form-group">
                            <label class="col-xs-12 col-sm-3 control-label text-right" for="dhName">资源服务编码</label>
                            <div class="col-xs-12 col-sm-9">
                                <input type="text" 
                                       name="code" 
                                       class="form-control" 
                                       ng-model="details_code" 
                                       required 
                                       />
                                <label class="red required">*</label>
                                <div class="error" ng-show="scopesAdd_form.code.$dirty && scopesAdd_form.code.$invalid">
                                    <small class="error" ng-show="scopesAdd_form.code.$error.required">请输入资源服务编码</small>
                                </div>
                            </div>
                        </div>
                        <div class="form-group height-auto">
                            <label class="col-xs-12 col-sm-3 control-label text-right" for="dhName">资源服务名称</label>
                            <div class="col-xs-12 col-sm-9">
                                <input type="text" 
                                       name="scopeName" 
                                       class="form-control" 
                                       ng-model="details_scope_name" 
                                       required 
                                       />
                                <label class="red required">*</label>
                                <div class="error" ng-show="scopesAdd_form.scopeName.$dirty && scopesAdd_form.scopeName.$invalid">
                                    <small class="error" ng-show="scopesAdd_form.scopeName.$error.required">请输入资源服务名称</small>
                                </div>
                            </div>
                        </div>
                        <div class="form-group height-auto">
                            <label class="col-xs-12 col-sm-3 control-label text-right" for="dhName">资源服务URL</label>
                            <div class="col-xs-12 col-sm-9">
                                <input type="text" 
                                       name="scopeUri" 
                                       class="form-control" 
                                       ng-model="details_scope_url" 
                                       required 
                                       />
                                <label class="red required">*</label>
                                <div class="error" ng-show="scopesAdd_form.scopeUri.$dirty && scopesAdd_form.scopeUri.$invalid">
                                    <small class="error" ng-show="scopesAdd_form.scopeUri.$error.required">资源服务URL不能为空</small>
                                    <small class="error" ng-show="ipRulesAdd_form.expression.$error.pattern">请输入正确的资源服务URL</small>
                                </div>
                            </div>
                        </div>
                        <div class="form-group height-auto">
                                <label class="col-xs-12 col-sm-3 control-label text-right" for="dhName">资源类型</label>   
                                <div class="col-xs-12 col-sm-9">
                                    <select ng-model="details_scope_type" 
                                            class="form-control"  
                                            >
                                        <option id="" value="">请选择</option>
                                        <option id="" value="0">系统资源</option>
                                        <option id="" value="1" selected>用户资源</option>
                                    </select>
                                </div>
                              </div>  
                        <div class="form-group height-auto">
                            <label class="col-xs-12 col-sm-3 control-label text-right">描述</label>
                            <div class="col-xs-12 col-sm-9">
                                <textarea rows=5
                                          type="text"
                                          name="description" 
                                          class="form-control" 
                                          ng-model="details_description"
                                          >
                                </textarea>
                            </div>
                        </div>
                    </form>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                        <button type="button" class="btn btn-primary" data-dismiss="modal" ng-disabled="scopesAdd_form.$invalid" ng-click="confirmNewlyAdded()">确定</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
<!-- 新增 END -->

<!-- 详情 BEGIN -->
    <div class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" id="details">
        <div class="modal-dialog " role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                    <h4 class="modal-title" id="myModalLabel">资源范围详细信息</h4>
                </div>
                <div class="modal-body">
                    <div class="form-group">
                        <label class="col-xs-12 col-sm-3 control-label text-right">资源服务编码：</label>
                        <div class="col-xs-12 col-sm-9">
                        <input type="text" 
                               name="code" 
                               class="form-control" 
                               ng-model="details_code" 
                               disabled 
                               />
                               </div>
                    </div>
                    <div class="form-group">
                        <label class="col-xs-12 col-sm-3 control-label text-right">资源服务名称：</label>
                        <div class="col-xs-12 col-sm-9">
                        <input type="text" 
                               name="scopeName" 
                               class="form-control" 
                               ng-model="details_scope_name" 
                               disabled 
                               />
                               </div>
                    </div>
                    <div class="form-group">
                        <label class="col-xs-12 col-sm-3 control-label text-right">资源服务URL：</label>
                        <div class="col-xs-12 col-sm-9">
                        <input type="text" 
                               name="scopeUri" 
                               class="form-control" 
                               ng-model="details_scope_uri" 
                               disabled 
                               />
                               </div>
                    </div>
                    <div class="form-group">
                        <label class="col-xs-12 col-sm-3 control-label text-right">资源类型：</label>
                        <div class="col-xs-12 col-sm-9">
                        <input type="text" 
                               name="scopeType" 
                               class="form-control" 
                               ng-model="details_scope_type" 
                               disabled 
                               />
                               </div>
                    </div>
                    <div class="form-group">
                        <label class="col-xs-12 col-sm-3 control-label text-right">描述：</label>
                        <div class="col-xs-12 col-sm-9">
                        <input type="text" 
                               name="description" 
                               class="form-control" 
                               ng-model="details_description" 
                               disabled 
                               />
                               </div>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-default" data-dismiss="modal">返回列表</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
<!-- 详情 END -->

<!-- 修改 BEGIN -->
    <div class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" id="edit">
        <div class="modal-dialog " role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                    <h4 class="modal-title" id="myModalLabel">修改资源范围</h4>
                </div>
                <div class="modal-body">
                     <form name="scopesUpdate_form" novalidate>
                            <div class="form-group">
                                <label class="col-xs-12 col-sm-3 control-label text-right" for="dhName">资源服务编码</label>
                            <div class="col-xs-12 col-sm-9">
                                <input type="text" 
                                       name="code" 
                                       class="form-control" 
                                       ng-model="details_code" 
                                       required 
                                       />
                                <label class="red required">*</label>
                                <div class="error" ng-show="scopesUpdate_form.code.$dirty && scopesUpdate_form.code.$invalid">
                                    <small class="error" ng-show="scopesUpdate_form.code.$error.required">请输入资源服务编码</small>
                                </div>
                            </div>
                        </div>
                        <div class="form-group height-auto">
                            <label class="col-xs-12 col-sm-3 control-label text-right" for="dhName">资源服务名称</label>
                            <div class="col-xs-12 col-sm-9">
                                <input type="text" 
                                       name="scopeName" 
                                       class="form-control" 
                                       ng-model="details_scope_name" 
                                       required 
                                       />
                                <label class="red required">*</label>
                                <div class="error" ng-show="scopesUpdate_form.scopeName.$dirty && scopesUpdate_form.scopeName.$invalid">
                                    <small class="error" ng-show="scopesUpdate_form.scopeName.$error.required">请输入资源服务名称</small>
                                </div>
                            </div>
                        </div>
                        <div class="form-group height-auto">
                            <label class="col-xs-12 col-sm-3 control-label text-right" for="dhName">资源服务URL</label>
                            <div class="col-xs-12 col-sm-9">
                                <input type="text" 
                                       name="scopeUri" 
                                       class="form-control" 
                                       ng-model="details_scope_url" 
                                       required 
                                       />
                                <label class="red required">*</label>
                                <div class="error" ng-show="scopesUpdate_form.scopeUri.$dirty && scopesUpdate_form.scopeUri.$invalid">
                                    <small class="error" ng-show="scopesUpdate_form.scopeUri.$error.required">请输入资源服务URL</small>
                                </div>
                            </div>
                        </div>
                        <div class="form-group height-auto">
                                <label class="col-xs-12 col-sm-3 control-label text-right" for="dhName">资源类型</label>   
                                <div class="col-xs-12 col-sm-9">
                                    <select ng-model="details_scope_type" 
                                            class="form-control" 
                                            ng-options="resource_type.id as resource_type.name for resource_type in which_resource_type"
                                            >
                                    </select>
                                </div>
                              </div>  
                        <div class="form-group height-auto">
                            <label class="col-xs-12 col-sm-3 control-label text-right">描述</label>
                            <div class="col-xs-12 col-sm-9">
                                <textarea rows=5
                                          type="text" 
                                          name="description" 
                                          class="form-control" 
                                          ng-model="details_description"
                                          >
                                </textarea>
                            </div>
                        </div>
                    </form>
                 </div>   
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                    <button type="button" class="btn btn-primary" data-dismiss="modal" ng-disabled="scopesUpdate_form.$invalid" ng-click="confirmEdit($event)">修改</button>
                </div>        
            </div>
        </div>
    </div>
<!-- 修改 END -->

<!-- 删除 BEGIN -->
    <div class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" id="delete">
        <div class="modal-dialog delete-modal">
            <div class="modal-content">
                <div class="modal-header">
                    <h4 class="modal-title text-center">删除警告</h4>
                </div>
                <div class="modal-body text-center">请确认是否删除该行资源范围</div>
                <div class="modal-footer">
                    <div class="col-md-6">
                        <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                    </div>
                    <div class="col-md-6">
                        <button type="button" class="btn btn-primary pull-left confirm-del-btn" ng-click="confirmDel()" data-dismiss="modal">确定</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
<!-- 删除 END -->
</div>

